<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" import="com.ffcs.crmd.platform.ui.utils.JspUtil"%>
<!DOCTYPE html>
<jsp:include page="/resources/theme/default/include/default-header-inc.jsp"></jsp:include>
<jsp:include page="/resources/theme/default/include/default-footer-inc.jsp"></jsp:include>
<html>
<head>
<title>菜单管理</title>
<script type="text/javascript" src="./cluster-service.js"></script>
<script type="text/javascript" src="../cluster-instance/cluster-instance-service.js"></script>
<script type="text/javascript" src="./cluster-controller.js"></script>
</head>
<body ng-app="clusterApp" ng-controller="clusterCtrl" style="background-color: transparent;">
	<div class="container-fluid content" style="margin-top: 12px;">
		<div class="panel">
			<div class="panel-heading">
				<i class="mark"></i>集群信息
			</div>
			<div class="panel-body" style="padding-top: 0px;">
				<div id="clusterTableToolbar" class="btn-group" style="width: 100%;">
					<button id="clusterAddButton" class="btn btn-sm btn-blue" data-toggle="modal" data-target="#clusterModal"
						ng-click="action='ADD'">
						<i class="glyphicon glyphicon-plus-sign"></i> 新增
					</button>
					<button id="clusterModButton" class="btn btn-sm btn-blue" data-toggle="modal" data-target="#clusterModal"
						ng-click="action='MOD'" disabled>
						<i class="glyphicon glyphicon-pencil"></i> 修改
					</button>
					<button id="clusterRemoveButton" class="btn btn-sm btn-danger" ng-click="deleteCluster();"  disabled>
						<i class="glyphicon glyphicon-remove"></i> 删除
					</button>
					
					<form class="form-inline pull-right">
						<div class="search-inline">
							<label>集群名称：</label> 
							<input type="text" class="form-control input-sm" ng-model="clusterVO.queryName">
							<button type="button" class="btn btn-sm btn-blue" ng-click="queryCluster();">查询</button>
						</div>
					</form>
				</div>
				<div class="table-responsive">
					<table id="clusterTable"
						data-id-field="id"
						data-side-pagination="server" 
						data-toolbar="#clusterTableToolbar" 
						data-click-to-select="true"
						data-pagination="true" 
						data-page-size="10"
						data-query-params-type="" 
						data-detail-view="true"
						data-page-list="[5, 10, 20]">
						<thead>
							<tr>
								<th data-checkbox='true' />
								<th data-field="name" data-align="center" data-valign="middle" data-class="table-column" >集群名称</th>
								<th data-field="serverAddrs" data-align="center" data-valign="middle" data-class="table-column" >地址</th>
							</tr>
						</thead>
					</table>
				</div>
			</div>
		</div>
	</div>
	<jsp:include page="./cluster-modal.jsp"></jsp:include>
</body>
</html>